import { MainGraph } from '@/components/MainGraph/MainGraph'
import { ChatLayout } from '@/components/Planner/ChatLayout/ChatLayout'
import { useStyles } from '@/hooks/styles'
import { useParams } from 'react-router-dom'

const Graph = () => {
  const styleClass = useStyles()
  const { projectID } = useParams()

  return (
    <div
      {...styleClass([], {
        display: 'flex',
        flexDirection: 'column',
        position: 'relative',
        width: '100%',
        height: '100%',
      })}
    >
      <MainGraph projectID={parseInt(projectID)} />
      <ChatLayout />
    </div>
  )
}

export default Graph
